<!-- 挂号详情 -->
<template>
	<view class="container">

		<!-- START:医生信息 -->
		<view class="doctor-info">
			<view class="doctor-info-image">
				<image src="/static/icon/icon_avatar.png" mode="aspectFill"></image>
			</view>
			<view class="doctor-info-content">
				<view class="doctor-info-content-top">
					<view class="name">
						{{options?.name}}
					</view>
					<!-- <view class="register-remaining">
						剩余号源：59 个
					</view> -->
				</view>
				<view class="doctor-info-content-outpatients">
					{{options?.department}}
				</view>
			</view>
		</view>
		<!-- END:医生信息 -->


		<!-- START:挂号信息 -->
		<view class="register-info">
			<view class="register-info-title">
				挂号信息
			</view>
			<view class="register-info-department" style="margin-top: 18rpx;">
				<view class="label">就诊科: </view>
				<view class="content">
					{{options?.department}} 的{{options?.type}}
				</view>
			</view>
			<!-- 	<view class="register-info-department">
				<view class="label">就诊时间: </view>
				<view class="content">
					2025-06-18 13:39-13：42
				</view>
			</view> -->
			<view class="register-info-department">
				<view class="label">诊察费: </view>
				<view class="content">
					{{options?.registrationFee}}元
				</view>
			</view>
		</view>
		<!-- END:挂号信息 -->

		<!-- START:挂号人信息 -->
		<view class="user-info" @click="onPatientList">
			<view v-if="Object.keys(patientItem).length != 0">
				<view class="name">
					{{patientItem.reportName}}
				</view>
				<view class="id">
					身份证号: {{patientItem.carid}}
				</view>
			</view>
			<view v-else>选择就诊人</view>
			<view class="">
				<uni-icons type="right" size="16"></uni-icons>
			</view>
		</view>
		<!-- END:挂号人信息 -->

		<!-- START:温馨提示 -->
		<view class="success">
			<view class="success-title">
				<text>温馨提示</text>
				<text class="text-1">（请认真阅读）</text>
			</view>

			<view class="" style="margin-top: 18rpx;">
				<view class="success-content">
					1.预约挂号实行实名制：预约时患者必须填写真是 的个人信息，就诊时携带本人社保科卡货身份证。
				</view>
				<view class="success-content">
					2.预约挂号实行实名制：预约时患者必须填写真是 的个人信息，就诊时携带本人社保科卡货身份证。
				</view>
				<view class="success-content">
					3.预约挂号实行实名制：预约时患者必须填写真是 的个人信息，就诊时携带本人社保科卡货身份证。
				</view>
				<view class="success-content">
					4.预约挂号实行实名制：预约时患者必须填写真是 的个人信息，就诊时携带本人社保科卡货身份证。
				</view>
			</view>

		</view>
		<!-- END :温馨提示 -->

		<view class="confirm" @click="onConfirm">
			挂号
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from "vue";
	import {
		onLoad,
		onShow
	} from "@dcloudio/uni-app";
	import {
		addre,
		isRepeatUser
	} from "@/api/index.js";
	const options = ref()
	const patientItem = ref({});
	onLoad((params) => {
		options.value = params ? JSON.parse(params.data) : params;
	})

	onShow(() => {
		console.log("执行")
		let data = uni.getStorageSync('patientItem');
		if (Object.keys(data).length != 0 && data) {
			console.log('patientItem.value', patientItem.value)
			patientItem.value = data;
		}

		console.log('patienqwqerqwerqwerrtItem.value', patientItem.value)
	})

	function objectToQueryString(obj) {
		return Object.entries(obj)
			.filter(([_, value]) => value !== undefined) // 过滤掉值为 undefined 的字段
			.map(([key, value]) => encodeURIComponent(key) + '=' + encodeURIComponent(value))
			.join('&');
	}

	function onConfirm() {
		
		if (!patientItem.value.reportName || !patientItem.value.carid) {
			uni.showToast({
				title: '请填写身份信息',
				icon: "none"
			})
			
			return 
		}

		uni.showModal({
			title: '挂号',
			content: '确认挂号吗？',
			success: res => {
				if (res.confirm) {
					let Department = uni.getStorageSync('Department');
					let patientItem = uni.getStorageSync('patientItem');
					isRepeatUser({
						carid: Number(patientItem.carid),
						phone: Number(patientItem.phone),
					}).then((obj) => {
						
						  if(obj==1){
							  uni.showToast({
							  	title: '该手机号的患者已存在',
								icon:'none'
							  })
							}else if(obj==2){
								uni.showToast({
									title: '该身份证号的患者已存在',
									icon:'none'
								})
							}else if(obj==3){
								uni.showLoading({
									title: '挂号中..',
									icon:'none'
								})
												
										
								
								let data = {
									...patientItem,
									department: Department.departmentId,
									reporttype: Department.registeredid,
									doctor: options.value.doctorId,
									price: options.value.registrationFee,
									userId: uni.getStorageSync('userInfo')?.id
								}
								
								let params = `?` + objectToQueryString(data)
								
								addre(data, params).then(res => {
									setTimeout(() => {
										uni.hideLoading();
										console.log("res", res)
										uni.showToast({
											title: "挂号成功！"
										})
									}, 1000)
									
								})
							}
					})
				
				}
			}
		})


	}

	function onPatientList() {
		uni.navigateTo({
			url: '/view/user/patientList/index'
		})
	}
</script>

<style lang="scss">
	@import "../../../uni.scss";
	page {
		background-color: #F5F6FA !important;
	}

	.container {
		padding: 32rpx;
	}

	@mixin box-background {
		background-color: #fff;
		border-radius: 20rpx;
	}

	.doctor-info {
		@include box-background;
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-items: center;
		padding: 26rpx 30rpx;

		.doctor-info-image {
			width: 98rpx;
			height: 98rpx;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.doctor-info-content {
			// display: flex;
			// flex-direction: row;
			// align-items: flex-start;
			// justify-content: space-between;
			flex: 1;

			margin-left: 18rpx;

			.doctor-info-content-top {
				display: flex;
				flex-direction: row;
				align-items: flex-end;
				justify-content: space-between;
				flex: 1;

				.name {
					font-family: '思源黑体';
					font-size: 28rpx;
					font-weight: normal;
					line-height: normal;
					letter-spacing: normal;
					/* 正文色/正文色 */
					color: #1A1A1A;
				}

				.register-remaining {

					font-family: '思源黑体';
					font-size: 22rpx;
					font-weight: normal;
					line-height: normal;
					letter-spacing: normal;
					/* 描边色/描边色辅助 */
					color: #AAAAAA;
					margin-left: 36rpx;
				}
			}

			.doctor-info-content-outpatients {
				margin-top: 12rpx;
				font-family: '思源黑体';
				font-size: 22rpx;
				font-weight: normal;
				line-height: normal;
				letter-spacing: normal;
				/* 描边色/描边色辅助 */
				color: #AAAAAA;
			}
		}

	}


	.register-info {

		padding: 32rpx 30rpx;
		margin-top: 24rpx;
		@include box-background;

		.register-info-title {

			font-family: Source Han Sans;
			font-size: 32rpx;
			font-weight: bold;
			line-height: normal;
			letter-spacing: normal;
			/* 纯黑 */
			color: #000000;
		}

		.register-info-department {

			font-family: Source Han Sans;
			font-size: 30rpx;
			font-weight: normal;
			line-height: normal;
			letter-spacing: normal;
			/* 正文色/正文色 */
			color: #1A1A1A;


			display: flex;
			justify-content: flex-start;
			align-items: flex-start;


			margin-top: 8rpx;

			.label {
				min-width: 150rpx;
				text-align: right;
				margin-right: 8rpx;
			}
		}
	}


	.user-info {
		@include box-background;
		margin-top: 24rpx;
		padding: 32rpx 30rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;

		.name {
			font-family: Source Han Sans;
			font-size: 30rpx;
			font-weight: normal;
			line-height: normal;
			letter-spacing: normal;
			/* 纯黑 */
			color: #000000;
		}

		.id {
			@extend .name;

			margin-top: 22rpx;
		}
	}


	.success {
		margin-top: 24rpx;
		padding: 32rpx 30rpx;
		@include box-background;

		.success-title {

			font-family: Source Han Sans;
			font-size: 32rpx;
			font-weight: bold;
			line-height: normal;
			letter-spacing: normal;
			color: #000000;

			.text-1 {
				font-family: Source Han Sans;
				font-size: 30rpx;
				font-weight: normal;
				line-height: normal;
				letter-spacing: normal;
				/* 错误色/错误色 */
				color: #EA0000;
			}
		}

		.success-content {
			font-family: Source Han Sans;
			font-size: 30rpx;
			font-weight: normal;
			line-height: normal;
			letter-spacing: normal;
			/* 正文色/正文色 */
			color: #1A1A1A;

			margin-top: 14rpx;
		}
	}


	.confirm {
		position: fixed;
		bottom: 50rpx;
		left: 32rpx;
		right: 32rpx;

		border-radius: 45rpx;
		/* 主要色/主要色 */
		background: $color-main;


		font-family: Source Han Sans;
		font-size: 32rpx;
		font-weight: normal;
		line-height: normal;
		letter-spacing: normal;
		/* 纯白 */
		color: #FFFFFF;

		height: 90rpx;
		line-height: 90rpx;
		text-align: center;

		&:active {
			background-color: rgba(1, 124, 255);
		}
	}
</style>